﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>FooTable - jQuery plugin for responsive HTML tables</title>
    <meta name="viewport" content="width = device-width, initial-scale = 1.0, minimum-scale = 1.0, maximum-scale = 1.0, user-scalable = no"/>
	<link href="css/bootstrap.css" rel="stylesheet" type="text/css"/>
	<link href="../css/footable.core.css?v=2-0-1" rel="stylesheet" type="text/css"/>
    <link href="css/footable-demos.css" rel="stylesheet" type="text/css"/>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
    <script>
        if (!window.jQuery) { document.write('<script src="js/jquery-1.9.1.min.js"><\/script>'); }
    </script>
    <script src="../js/footable.js?v=2-0-1" type="text/javascript"></script>
	<script src="js/bootstrap-tab.js" type="text/javascript"></script>
    <script src="js/demos.js" type="text/javascript"></script>
</head>
<body>
	<div class="demo-container">
        <ul class="breadcrumb">
            <li><a href="http://fooplugins.com/plugins/footable-jquery/">FooTable</a> <span class="divider">&raquo;</span></li>
            <li><a href="index.htm">Demos</a> <span class="divider">&raquo;</span></li>
            <li class="active">Demo Name</li>
        </ul>
        <div class="alert">
            Demo description goes here
        </div>
		<ul class="nav nav-tabs">
			<li class="active"><a href="#demo">Demo</a></li>
			<li><a href="#setup">Setup</a></li>
			<li><a href="#docs">Docs</a></li>
		</ul>
		<div class="tab-content">
			<div class="tab-pane active" id="demo">
				FooTable goes here
			</div>
			<div class="tab-pane" id="setup">
				<ol class="foo-setup">
					<li><h4>A Required Step</h4>
						<pre>some code</pre>
                        <div class="alert alert-success">
                            <strong>Please Note</strong>
                            Blah blah blah.
                        </div>
					</li>
					<li><h4>[optional]</strong> An Optional Step</h4>
						<pre>some more code</pre>
					</li>
				</ol>
			</div>
			<div class="tab-pane" id="docs">
				<h4>Doc Title</h4>
				<p>Some insightful comments about something very useful
					<pre>code: {
	foo: 123,
	bar: 'hell yeah!'
}</pre>
				</p>
			</div>
		</div>
	</div>
    <script type="text/javascript">
        $(function () {
            $('table').footable();
        });
    </script>
</body>
</html>
